<template>
	<div id="full" class="full">
		<van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
			<van-swipe-item v-for="(image, index) in images" :key="index">
			    <img v-lazy="image" />
			  </van-swipe-item>
		</van-swipe>
	</div>
</template>

<script>
	export default {
		name: "swiper",
		data() {
			return {
				images: [
					'https://www.ibox.art/file/oss/test/image/nft-goods/f431d9082a974a7481f2d5f41ae8a376.png',
					'https://static.ibox.art/file/oss/test/image/nft-goods/44e5f77ab77643c5a7ad7a000ca6709b.jpg?style=st6',
					'https://static.ibox.art/file/oss/test/image/nft-goods/36ba22c16faa480e98779c3154e1506b.jpg?style=st6',
				],
			}
		},
	}
</script>

<style lang="less" scoped="scoped">
	* {
		margin: 0;
		padding: 0;
	}

	.full {
		width: 100%;

		.my-swipe {
			width: 100%;
			height: 150px;
			background-color: #39a9ed;

			.van-swipe-item {
				color: #fff;
				font-size: 20px;
				line-height: 150px;
				text-align: center;
				background-color: #39a9ed;
			}
		}
		img{
			width: 100%;
			height: 100%;
		}
	}
</style>
